<template>
	<view class="pad20 radius6 flex box" style="align-items: flex-start;" :class="{warning}">
		<u-checkbox size='34' style="margin:0 ;" :value="value" @change="handleChange" class="padv8" />
		<view class="flex1 font24">
			我已阅读并同意 <text @click.stop="previewA" style='color:#26c399'>
				《用户注册协议》
			</text>和<text style='color:#26c399' @click.stop="previewB">
				《氢云用户个人信息及隐私说明》
			</text>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			value: Boolean
		},
		data() {
			return {
				warning: false
			}
		},
		methods: {
			showWarning() {
				this.warning = true
				this.$msg('请先阅读并同意用户隐私协议', () => {
					this.warning = false
				})
			},
			handleChange(e) {
				this.$emit('input', e.value)
			},
			previewA() {
				this.$go2(this.$makeUrl('/pages/p1/lives/play', {
					url: encodeURIComponent('https://chat.qker.com/uc/polciyIqingyun.html')
				}))
			},
			previewB() {
				this.$go2(this.$makeUrl('/pages/p1/lives/play', {
					url: encodeURIComponent('https://chat.qker.com/uc/chatIqingyun.html')
				}))
			},
		},
	}
</script>

<style lang="scss">
	.box {
		border: 1px solid transparent;

		/deep/ .u-checkbox__label {
			margin-right: 0
		}
	}

	.warning {
		animation: show ease-in-out 2s;
	}

	@keyframes show {
		from {
			border-color: #26c399
		}

		to {
			border-color: transparent
		}
	}
</style>
